<template>
  <div class="container">
    <!-- 体检项目 -->
    <div class="exam-project">
      <!-- <div class="exam-project-title">体检项目</div> -->
      <div class="exam-project-group">
        <div class="exam-project-item" @click="handleSignIn">
          <div class="exam-project-item-title">签到</div>
          <uni-icons type="right" size="20"></uni-icons>
        </div>
        <div
          class="exam-project-item"
          v-for="item in projectList"
          :key="item.value"
          @click="goExamProjectPage(item)"
        >
          <div class="exam-project-item-title">{{ item.name }}</div>
          <uni-icons type="right" size="20"></uni-icons>
        </div>
      </div>
    </div>
    <div>
      <!-- 提示信息弹窗 -->
      <uni-popup ref="message" type="message">
        <uni-popup-message
          :type="msgType"
          :message="messageText"
          :duration="2000"
        ></uni-popup-message>
      </uni-popup>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      type: "center",
      msgType: "success",
      messageText: "这是一条成功提示",
      // 学生
      // projectList: [
      //   {
      //     name: "内科",
      //     value: 1,
      //   },
      //   {
      //     name: "外科/五官科",
      //     value: 2,
      //   },
      //   {
      //     name: "视力",
      //     value: 3,
      //   },
      //   {
      //     name: "辨色力",
      //     value: 4,
      //   },
      //   {
      //     name: "身高体重胸围",
      //     value: 5,
      //   },
      //   {
      //     name: "血压脉搏",
      //     value: 6,
      //   },
      //   {
      //     name: "采血",
      //     value: 7,
      //   },
      //   {
      //     name: "放射线",
      //     value: 8,
      //   },
      // ],
      // 教职员工
      projectList: [
        {
          name: "外科",
          value: 2,
        },
        {
          name: "视力",
          value: 3,
        },
        {
          name: "身高体重胸围",
          value: 5,
        },
        {
          name: "血压脉搏",
          value: 6,
        },
        {
          name: "采血",
          value: 7,
        },
        {
          name: "放射线",
          value: 8,
        },
        {
          name: "心电",
          value: 9,
        },
        {
          name: "彩超",
          value: 10,
        },
        {
          name: "妇科",
          value: 11,
        },
      ],
      // 用户角色
      userRole: undefined,
    };
  },
  onLoad(args) {
    this.userRole = this.$store.state.user.roles;
    let rolesList = ["学生", "教职员工", "医护员工"];
    console.log("当前用户角色", rolesList[this.userRole - 1]);
  },
  methods: {
    /**
     * 跳转 开始体检项目 页面
     */
    goExamProjectPage(item) {
      // uni.navigateTo({
      //   url: `/pages/viewProject/index?projectId=${item.value}`,
      // });
      this.scanCode("project");
    },
    // 签到
    handleSignIn() {
      console.log("点击了开始签到");
      this.scanCode("signIn");
    },
    //提示信息弹窗
    messageToggle(type, text) {
      this.msgType = type;
      this.messageText = text;
      this.$refs.message.open();
    },
    // 扫码
    scanCode(type) {
      uni.scanCode({
        success: (res) => {
          console.log("扫码成功", res);
          if (res.errMsg == "scanCode:ok") {
            console.log("扫码成功", res.result);
            if (type == "project") {
              this.messageToggle("success", "扫码成功");
              uni.navigateTo({
                url: `/pages/viewProject/index?projectInfo=${res.result}`,
              });
            }
            if (type == "signIn") {
              this.messageToggle("success", "签到成功");
            }
          }
        },
        fail: (err) => {
          console.log("扫码失败", err);
          if (err.errMsg == "scanCode:fail") {
            this.messageToggle("error", "签到失败");
          }
        },
        complete: () => {
          console.log("扫码结束");
        },
      });
    },
  },
};
</script>

<style scoped>
.container {
  width: 100vw;
  height: 100%;
  background-color: #fff;
}

.exam-project-group {
  padding-top: 16px;
  padding-left: 10px;
}
.exam-project-title {
  padding: 16px 13.2px;
  font-weight: bold;
}
.exam-project-item {
  display: flex;
  justify-content: space-between;
  margin: 10px;
  padding: 10px;
  border-bottom: 0.0625rem solid #eee;
}
</style>